import React, { useState } from 'react';
import dayjs from 'dayjs';
import { useInterval } from 'ahooks';
import AvatarDropdown from '@/layouts/HeaderRightContent/AvatarDropdown';
import BellDropdown from '@/layouts/HeaderRightContent/BellDropdown';

interface HeaderRightContentProps {}

const HeaderRightContent: React.FC<HeaderRightContentProps> = (props) => {
    const [currDateTime, setCurrDateTime] = useState(dayjs());
    useInterval(() => {
        setCurrDateTime(dayjs());
    }, 1000);

    return (
        <div className={`ant-pro-global-header-header-actions`}>
            <div className={'kf-system-current-time-action-item'}>{currDateTime.format('YYYY-MM-DD dddd')}</div>
            <BellDropdown />
            <AvatarDropdown />
        </div>
    );
};

export default HeaderRightContent;
